/*一、头部*/
/* 1、默认隐藏子菜单
 * 2、鼠标移入：显示当前子菜单
 * 3、鼠标移出：隐藏子菜单
 */
// 1)获取4个菜单（li）对象
var menu = $('#header #example-navbar-collapse li.menu');
// 2) 获取4个子菜单对象
var submenu = $('#header #example-navbar-collapse li.menu ul.wrap');
// 3)默认隐藏子菜单
submenu.css('display', 'none');
// 4)鼠标移入：显示当前子菜单(其他子菜单隐藏)
menu.mouseover(
	function() {
		// 当前显示（向下滑动显示）
		$(this).find('.wrap').slideDown();
		// 其他隐藏
		$(this).siblings().find('.wrap').css('display', 'none');
	}
);
// 5) 鼠标移出：隐藏子菜单
menu.mouseout(
	function() {
		submenu.css('display', 'none');
	}
);

/*头部增加课程搜索功能*/
/* 给input添加键盘松开keyup事件：
   循环判断li内容是否包含input输入的值，若包含显示，否则隐藏*/
  var headr_input=$('#header #myInput');
  var header_li=$('#header ul.mycourse li');
  headr_input.keyup(
  	function(){  		
  		for(var i=0;i<header_li.length;i++){
  			// li内容
  			var value_li=header_li.eq(i).text().toLocaleLowerCase();
  			// input输入内容
  			var value_input=headr_input.val().trim().toLowerCase();
  			// 判断是否包含
 			if(value_li.indexOf(value_input)>-1){
  				header_li.eq(i).css('display','block');
 			}else{
  				header_li.eq(i).css('display','none');
  			}
  		}
  	}
  );

/*四、我们的成员*/
/* 1、鼠标移入照片上，出现个人座右铭
   2、鼠标移出照片，隐藏个人座右铭
   3、每隔1秒，随机显示另外3位成员信息：
      计时器重复执行的函数：随机产生3个学生id，将页面是的照片，座右铭，介绍都替换成该学生
*/
var div = $('.our-member .data-item div');
var p = $('.our-member .data-item p');
// 定义计时器
var timer_member = setInterval(fun_member, 1000);

// 鼠标移入div：让对应的p出现, 取消计时器
div.mouseover(
	function() {
		$(this).siblings('p').css('display', 'block');
		// 取消计时器
		clearInterval(timer_member);
	}
);
// 移出：所有的p都隐藏，恢复计时器
div.mouseout(
	function() {
		p.css('display', 'none');
		// 恢复计时器
		timer_member = setInterval(fun_member, 1000);
	}
);

// 创建学生对象
function Student(id,name,hometown,title,img,motto){
	this.id=id;
	this.name=name;
	this.hometown=hometown;
	this.title=title;
	this.img=img;
	this.motto=motto;
}
var s1=new Student(1,'陈用群','温州','学生会','img/pic/1.jpg','好好学习，天天向上');
var s2=new Student(2,'郑良靖','温州','纪律委员','img/pic/2.jpg','好好学习，天天向上');
var s3=new Student(3,'杨翌','丽水','团支书','img/pic/3.jpg','好好学习，天天向上');
var s4=new Student(4,'陈一颖','台州','一姐','img/pic/4.jpg','好好学习，天天向上');
var s5=new Student(5,'陶伟','温州','学生会','img/pic/5.jpg','好好学习，天天向上');
var s6=new Student(6,'夏阳','台州','班长','img/pic/6.jpg','好好学习，天天向上');
var s7=new Student(7,'潘益婷','建德','班主任','img/pic/7.jpg','好好学习，天天向上');
var s8=new Student(8,'宋三岁','绍兴','儿子','img/pic/8.jpg','好好学习，天天向上');
var s9=new Student(9,'家辉哥','台州','家辉哥','img/pic/9.jpg','好好学习，天天向上');
var s10=new Student(10,'丁振铮','温州','爱学习','img/pic/10.jpg','好好学习，天天向上');

var yd1701=[s1,s2,s3,s4,s5,s6,s7,s8,s9,s10];
// 定义计数器要执行的函数
function fun_member() {
	//	console.log("123");
	//随机产生3个学生id，将页面是的照片，座右铭，介绍都替换成该学生
	/* 1、创建学生对象 （模板，new 10个学生）
	   2、创建数组：每一个元素就是学生对象
	   3、循环（3次）
	      1）产生一个随机数
	      2）获取数组相应的index(随机数):照片、座右铭、介绍
	      3）替换页面上相应的显示*/
	for(var i=0;i<3;i++){
		var r=Math.floor((Math.random()*10));
		var img=yd1701[r].img;
		var motto=yd1701[r].motto;
		var intro=yd1701[r].title+"："+yd1701[r].name+
		"，"+yd1701[r].hometown;
		div.eq(i).find('img').attr("src",img);
		p.eq(i).text(motto);
		p.eq(i).siblings('h4').text(intro);
	}
}


/*我们的活动*/
/*鼠标移入移出事件*/
var event_item=$('.our-event .data-item .item');
event_item.mouseover(
	function(){
		//背景颜色，其他白色
		$(this).css('background','dodgerblue');
		$(this).children().css('color','white');
	}
);
event_item.mouseout(
	function(){
		$(this).css('background','white');
		$(this).find('span').css('color','dodgerblue');
		$(this).find('h3').css('color','gray');
		$(this).find('h4').css('color','dodgerblue');
	}
);
/*我们的课程*/
/*鼠标移入事件：当前块特殊样式，其他块普通样式
           当前块的class name设置为：card-item card-active
           其他块的class name设置为：card-item*/
var course_li=$('.our-course .data-course .card-item');
course_li.mouseover(
	function(){
		/*1、设置css样式：css()
		  2、设置html属性：attr()
		  3、设置html的内容：text()*/
		$(this).attr('class','card-item card-active');
		$(this).siblings().attr('class','card-item');
	}
);

/*右侧回到顶部*/
/*1、默认回到顶部箭头隐藏
  2、滚动事件
     判断离顶部的距离大于100px，显示回到顶部箭头，否则隐藏该箭头
  3、回到顶部箭头点击事件
          回到顶部
  4、鼠标移入/移出事件：  
      a标签的兄弟标签div 显示/隐藏
  */
  var goTop=$('#clan-slider #slider-goTop');
  goTop.hide();
  $(window).scroll(
  	function(){
 		// $(window).screenTop : undefined
 		if($(window).scrollTop()>150){
  			//淡入  			goTop.fadeIn();
  		}else{
  			goTop.fadeOut(); // 淡出
  		}
  	}
 );
var goTop= $('#clan-slider #slider-goTop');
  goTop.hide();
$(window).scroll(
	function(){
		if($(window).scrollTop()>150){
			goTop.fadeIn();
		}else{
			goTop.fadeOut();
		}
	}
);
goTop.click(
	function(){
		//500毫秒内回到顶部
		$('html').animate({'scrollTop':0},500);
	}
);
$('#slider-chat,#slider-qq,#slider-phone').hover(
	//鼠标移入执行的函数
	function(){
	$(this).next().show();	
	},
	//鼠标移出执行的函数
	function(){
		$(this).siblings('div').hide();
	}
);